import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import "@/assets/css/common.css"
import "@/assets/css/el-reset.css"
import qfSubMenu from "qf-sub-menu" //引入我们的组件
//使用Vue.use()将组件注入到所有的子组件
Vue.use(qfSubMenu)
import nprogress from "nprogress"
import "nprogress/nprogress.css"
Vue.config.productionTip = false;


//路由守卫
router.beforeEach((to, from, next) => {
  //打开进度条
  nprogress.start()

  //to  去往的页面
  //  console.log("to",to)
  //from 从哪个页面来的
  //  console.log("from",from)
  //next 是一个函数 不写 跳转不过去
  //  console.log("next",next)

  //1.判断本地存储中是否有token,如果有就放行,如果没有那就让他重新跳转到登录页面
  let token = localStorage.getItem("login-token")
  if (token) {
    if (store.state.userMenu.length === 0) {
      //用户的路由信息(菜单信息)没有了,需要重新发起请求
      store.dispatch('FETCH_MENULIST')
        .then(() => {
          //重新激活动态添加的路由,replace :true 不产生历史记录
          // next({ path: to.path, replace: true })
          next({ ...to, replace: true })

        })
    } else {
      next()

    }

  } else {
    //2.用户没有登入,不能访问登入页面以外的页面
    // 如果用户访问的页面是login就放行 否则就是死循环
    if (to.path === "/login") {
      next()
    } else {
      //如果不是login就拦截,并且跳转到login页面
      next({ path: "/login" })
    }
  }


})

//全局后置钩子
router.afterEach((to,next)=>{
  //停止进度条
  nprogress.done()

})

Vue.use(ElementUI);

new Vue({
  router,
  store,
  render: (h) => h(App),
}).$mount("#app");
